{include file="assets::smarty-templates::notifications"|ToPath}
{html_script src="registration.js"}

<h2>Inscripci&oacute;n en Linea para la carrera de: </h2>

<h1 id="career-name">{$nombrePlan|lower|capitalize}</h1>

<p>
    <a id="changeCarreer" href="{$return}">Elegir otra carrera</a>
</p>

<p>
    <em>Todos los campos son obligatorios.</em>
</p>

<form method="POST" action="{$action}" class="form-validate" id="inscription-form">

    <input type="hidden" id="codigoPlan" name="CodigoPlan" value="{$codigoPlan}"/>
    <input type="hidden" id="nombrePlan" name="NombrePlan" value="{$nombrePlan}"/>
    <input type="hidden" id="detalleConcepto" name="DetalleConcepto" value="{$codigoTipoActual|default:0}"/>

    <fieldset>
        <legend>Informaci&oacute;n Personal</legend>
        <dl>
            <dt><label>Tipo de Documento:</label></dt>
            <dd>
                <select name="TipoDocumentoIdentidad">
                    <option value="2">C&eacute;dula de Ciudadan&iacute;a</option>
                    <option value="3">C&eacute;dula de Extranjer&iacute;a</option>
                    <option value="3">Pasaporte</option>
                    <option value="0">Registro Civ&iacute;l</option>
                    <option value="1">Tarjeta de Identidad</option>
                </select>
            </dd>
        </dl>
        <dl>
            <dt><label>N&uacute;mero de Identificaci&oacute;n:</label></dt>
            <dd><input type="text" name="NumeroDocumentoIdentidad" class="required validate-numeric"/></dd>
        </dl>
        <dl>
            <dt><label>Nombres:</label></dt>
            <dd><input type="text" name="Nombres" class="required" /></dd>
        </dl>
        <dl>
            <dt><label>Apellidos:</label></dt>
            <dd><input type="text" name="Apellidos" class="required" /></dd>
        </dl>
        <dl>
            <dt><label>G&eacute;nero:</label></dt>
            <dd>
                <select name="Sexo">
                    <option value="0">Masculino</option>
                    <option value="1">Femenino</option>
                </select>
            </dd>
        </dl>
        <dl>
            <dt><label>Fecha de Nacimiento:</label></dt>
            <dd><input type="text" name="FechaNacimiento" class="datepicker" /></dd>
        </dl>
        <dl>
            <dt><label>Pais de Nacimiento:</label></dt>
            <dd>
                <select name="PaisNacimiento" id="pais-nacimiento">
                    <option>- Elegir -</option>
                    {foreach $paises as $pais}
                    <option value="{$pais->getNombre()}">
                        {$pais->getNombre()}
                    </option>
                    {/foreach}
                </select>
            </dd>
        </dl>
        <dl>
            <dt><label>Departamento de Nacimiento:</label></dt>
            <dd>
                <input type="hidden" id="nombre-departamento-nacimiento" name="DepartamentoNacimientoNombre" />
                <select name="DepartamentoNacimiento" id="departamento-nacimiento" >
                </select>
            </dd>
        </dl>
        <dl>
            <dt><label>Municipio de Nacimiento:</label></dt>
            <dd>
                <select name="CiudadNacimientoNombre" id="municipio-nacimiento">
                </select>
            </dd>
        </dl>
    </fieldset>
    <fieldset>
        <legend>Informaci&oacute;n de Contacto</legend>

        <dl>
            <dt><label>Celular:</label></dt>
            <dd><input type="text" name="Celular" class="required validate-numeric"/></dd>
        </dl>
        <dl>
            <dt><label>Municipio de Residencia:</label></dt>
            <dd>
                <input type="text" name="CiudadResidencia" class="required"/>
            </dd>
        </dl>
        <dl>
            <dt><label>Direcci&oacute;n de Residencia:</label></dt>
            <dd><input type="text" name="Direccion" class="required" /></dd>
        </dl>
        <dl>
            <dt><label>Telefono de Residencia:</label></dt>
            <dd><input type="text" name="Telefono" class="required validate-numeric"/></dd>
        </dl>
        <dl>
            <dt><label>Estrato Residencia:</label></dt>
            <dd>
                <select name="Estrato">
                    <option value="1">Estrato 1</option>
                    <option value="2">Estrato 2</option>
                    <option value="3">Estrato 3</option>
                    <option value="4">Estrato 4</option>
                    <option value="5">Estrato 5</option>
                    <option value="6">Estrato 6</option>
                </select>
            </dd>
        </dl>
        <dl>
            <dt><label>Correo Electr&oacute;nico:</label></dt>
            <dd><input type="text" name="Email" class="required validate-email"/></dd>
        </dl>
    </fieldset>
</form>

<script type="text/javascript" >
    {literal}
    jQuery.noConflict();
    jQuery(document).ready(function($){

        $("#inscription-form").submit(function(){
            var valid = validateForm(document.getElementById("inscription-form"));
            return valid;
        });

        $("#pais-nacimiento").change(function(){
            getDepartments($("#pais-nacimiento").val(), loadDepartmentsForCoutry);
        });

        $("#inscription-form").formToWizard({submitButton: "enviar"});

        function formatCityOption(city){
            return '<option value="'+ city.Nombre +'">'+ city.Nombre +'</option>';
        }

        onDepartmentSelect("#departamento-nacimiento", "#municipio-nacimiento", formatCityOption, "#nombre-departamento-nacimiento");

    });
    {/literal}
</script>